<template>
    <div id="systemAdd" class="mt10">
        <!-- 角色选择开始 -->
        <div>
             <el-dialog title="Category" :visible.sync="categoryTableVisible" :close-on-click-modal="false" :close-on-press-escape="false">
                <div class="fourForm tableForm menuTreeOption mt20"><!--@select="selectCategory" -->
                    <el-table :data="paramNames" @current-change="selectCategory"  border highlight-current-row>
                        <!--<el-table-column type="selection" align="center"></el-table-column>-->
                        <el-table-column property="paramName" label="category" align="center"></el-table-column>
                    </el-table>
                </div>
                <div class="btnArea mt20 tac">
                    <el-button @click="closeRoleSelct">Confirm</el-button>
                </div>
            </el-dialog>
        </div>
        <!-- 角色选择结束 -->
        <div>
            <el-form ref="addForm" :model="addForm" class="formEmbedTable mt20" :rules="rules">
                <table>
                    <caption>Add</caption>
                    <tr>	
                        <td>Parameter ID: </td>
                        <td >
                            <el-form-item prop="paramCode">
                                <el-input v-model="addForm.paramCode" clearable></el-input>
                            </el-form-item>
                        </td>	
                        <td>Parameter</td>
                        <td>
                            <el-form-item prop="paramValue">
                                <el-input v-model="addForm.paramValue" clearable></el-input>
                            </el-form-item>
                        </td>				
                    </tr>
                    <tr>		
                        <td>Category</td>
                        <td>
                            <el-form-item prop="paramName">
                                <el-input v-model="addForm.paramName"></el-input>
                                <span class="btnArea">
                                    <el-button @click="categoryTableVisible = true">Search</el-button>
                                </span>
                            </el-form-item>
                        </td>
                        <td>Description</td>	
                        <td>
                            <el-form-item prop="paramShow">
                                <el-input v-model="addForm.paramShow" clearable></el-input>
                            </el-form-item>
                        </td>				
                    </tr>
                </table>
            </el-form>
        </div>
        <div class="btnArea mt20 tac">
            <el-button type="primary" @click="queryAuth('addForm')">Confirm</el-button>
            <el-button type="primary" @click="back()">Cancel</el-button>
        </div>
        <!--授权确认页面弹窗-->
        <div>
            <ynet-authDialog ref="dialogTable"  @getAuthForm="getAuthForm"></ynet-authDialog>
        </div>
    </div>
</template>
<script>
 import ghbIcon from '@src/components/icon'
    export default {
        name:'systemAdd',
        components:{
            ghbIcon
        },
        props:[],
        mounted(){//获取描述信息
            this.$tools.request(this,'IM0204QueryAction.do',{paramCode:'0'}).then(data=>{
                console.log("data:"+JSON.stringify(data))
                this.paramNames=data.body.paramList;
            })
        },
        data(){
            return{
                categoryTableVisible:false,
                addForm:{
                    bsnCode:'IM0204',actionType:'0',paramValue:'',paramCode:'',paramName:'',paramShow:'',
                },
                paramNames:[],
                authForm: { authUserNo: '', password: '',randomField:''},
                rules:{
                    paramValue:[
                        {required:true,trigger:'blur'},
                    ],
                    paramCode:[
                        {required:true,trigger:'blur'},
                        {validator:this.$tools.validator.isEngNum,trigger:'blur'},
                    ],
                    paramName:[
                        {required:true,trigger:'blur'},
                    ],
                },
                needAuth:'',
                authType:'',  
            }
        },
        methods:{
            selectCategory(val){
                //选择的角色
                console.log("val"+val)
                this.addForm.paramName=val.paramName;
                // if(val.length!=1){
                //     this.$alert('请选择一项', '温馨提示', {
                //         confirmButtonText: 'Confirm',
                //         callback: action => {
                //         }
                //     });
                // }else{
                //     this.addForm.paramName=val[0].paramName;
                    
                // }
            },
            closeRoleSelct(){
                this.categoryTableVisible=false;
            },
            getAuthForm(val){
                //获取授权数据
                this.authForm=val;
                console.log("val:"+JSON.stringify(val))
                this.addForm=$.extend(this.addForm,this.authForm)
                this.submit()  //自己页面提交给后台的.do方法
            },
            queryAuth(formName){//查询授权模式
                this.$refs[formName].validate((valid)=>{
                    if(valid){
                        let body={};body.bsnCode="IM0204";body.version="IM0204",
                        this.$tools.request(this,"IM010001Action.do",body).then(data=>{
                            if(data.body.errorCode==0){
                                if(data.body.needAuth==0){//无需授权
                                    this.submit()
                                }else if(data.body.needAuth==1 && data.body.authType==1 ){
                                    this.needAuth=1;
                                    this.authType=1;
                                    this.$refs["dialogTable"].show()
                                }else if( data.body.needAuth==1 && data.body.authType==2 ){
                                    this.needAuth=1;
                                    this.authType=2;
                                    this.submit()
                                }else{
                                   this.$alert('Authorization Type Error', {
                                        confirmButtonText: 'Confirm',
                                        callback: action => {
                                        }
                                    });
                                }
                            }else{
                                this.$alert("System Error Try again", "warning", {
                                    confirmButtonText: 'Confirm',
                                    callback: action => {
                                    }
                                });
                            }
                            
                        })
                    }
                })
			},
            submit(){
                console.log("addForm:"+JSON.stringify(this.addForm))
                this.$tools.request(this,"IM0204Action.do",this.addForm).then(data=>{
                    if(data.body.errorCode==0){
                        if(this.needAuth==1 && this.authType==2){
                            this.$message({
								type:'success',
								message:'Waiting for Authorized'
							})
                            this.$emit("back")
                        }else if(this.needAuth==1 && this.authType==1){
                            if(data.body.authStatus==1){
                                this.$message({
                                    type:'warning',
                                    message:'Authorship No. or password wrong ,please resume load',
                                    showClose:true,
                                })
                                this.$emit("back")
                            }else{
                                 this.$message({
                                    type:'success',
                                    message:'Add Success',
                                    showClose:true,
                                })
                                this.$emit("back")
                            }
                        }else{
                            this.$message({
                                type:'success',
                                message:'Add Success',
                                showClose:true,
                            })
                            this.$emit("back")
                        }
                    }else{
                        this.$alert("System Error Try again", "warning",{
                            confirmButtonText: 'Confirm',
                            callback: action => {
                            }
                        })
                    }
                })
            },
            back(){//返回到查询页面
                this.$emit('back')
            }
        }
    }
</script>